
html, body {
  height: 100%;
}

#main-wrapper {
  position: relative;
  min-height: 100%;

  .mode-edit & {
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
  }
}

.mode-edit {
  #close-edit-mode {
    display: none;
    position: fixed;
    top: 0;
    right: 50%;
    z-index: 10;

    .btn {
      margin: 5px (5px + 15px) 0 0; // 15px for scroll bar width
    }
  }

  #editor-wrapper {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 50%;

    .CodeMirror {
      height: 100%;
    }
  }
  #editor {
    // The textarea is only used by CodeMirror to obtain the source code, the actual editor is placed after the textarea
    // -> We hide the textarea in order to avoid flickering while loading
    display: none;
  }

  #main-wrapper {
    display: none;
  }
}

.mode-createUser {
  form {
    width: 600px;
    margin: 100px auto;
  }
}
